import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import * as actions from '../../actions/index'
import 'antd/dist/antd.css'
import { Drawer, Button } from 'antd'
import propTypes from 'prop-types'

class Detele extends Component {

    static defaultProps = {
        index: 'stranger'
    }

    static propTypes = {
        index: propTypes.number
    }

    state = { visible: false };

    showDrawer = () => {
        this.setState({
            visible: true,
        });
    };

    onClose = () => {
        this.setState({
            visible: false,
        });
    };

    deteleBtn(index) {
        this.props.detele_Btn(index)
    }

    quBtn() {
        this.setState({
            visible: false
        })
    }

    render() {
        let { index } = this.props
        return (
            <div>
                <div>
                    <Button style={{ backgroundColor: 'red', marginLeft: '5px' }} type="primary" onClick={this.showDrawer}>
                        删除
                    </Button>
                </div>
                <Drawer
                    title="删除"
                    placement="top"
                    closable={false}
                    onClose={this.onClose}
                    visible={this.state.visible}
                    getContainer={false}
                    style={{ position: 'absolute' }}
                >
                    <p>确定删除吗</p>
                    <p>
                        <Button style={{ backgroundColor: 'red', color: 'white' }} onClick={
                            this.deteleBtn.bind(this, index)
                        }>删除</Button>
                        <Button onClick={
                            this.quBtn.bind(this)
                        }>取消</Button>
                    </p>
                </Drawer>
            </div>
        )
    }
}

let mapStateToProps = ({ dataReducer }) => {
    return {
        ...dataReducer
    }
}

let mapDispatchToProps = (dispatch) => bindActionCreators(actions, dispatch)

export default connect(mapStateToProps, mapDispatchToProps)(Detele)